<template>
  <div>
    <div>
      <el-table v-loading="listLoading" :data="feedbackList" row-key="id" fit highlight-current-row
                :header-row-style="{'font-family': 'PingFangSC-Semibold','backgroundColor': '#f5f7fa','color':'#5c6065'}"
                class="table c-width100 color-222 family-PingFangSC-Regular font-s12">
        <el-table-column label="问题">
          <template slot-scope="scope">
            <div><span>{{scope.row.createdAt}}&nbsp;|&nbsp;{{scope.row.mpName}}</span></div>
            <div>{{scope.row.name}}</div>
          </template>
        </el-table-column>
        <el-table-column width="100" align="center" label="状态">
          <template slot-scope="scope">
            <span>{{scope.row.status==-1?'未查看':'已阅'}}</span>
          </template>
        </el-table-column>
        <el-table-column width="100" align="center" label="操作">
          <template slot-scope="scope">
            <b @click="linkToFeedbackDetail(scope.row.feedbackId)">查看</b>
          </template>
        </el-table-column>
      </el-table>
      <div class="block text-c">
        <!--分页组件 current-page:当前页   -->
        <!--   page-sizes:每页几条数据（选项）   -->
        <!--   page-size:每页几条数据   -->
        <!--   total:总条数   -->
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="listQuery.pageIndex"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="listQuery.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="listQuery.total">
        </el-pagination>
      </div>
    </div>
  </div>
</template>
<script>
import { toGetFeedbackList } from '@/api/feedback'
export default {
  props: ['listQuery', 'feedbackList'],
  data() {
    return {
      listLoading: false
    }
  },
  methods: {
    getFeedbackList() {
      this.listLoading = true
      toGetFeedbackList(this.listQuery).then(res => {
        this.feedbackList = res.data.data.data
        this.listQuery.total = res.data.data.total
        this.listLoading = false
      })
        .catch(err => {
          console.log(err)
        })
    },
    linkToFeedbackDetail(id) {
      this.$router.push({ path: `/feedbackLists/feedbackDetail/${id}` })
    },
    handleSizeChange(val) {
      this.listQuery.limit = val
      this.getFeedbackList()
    },
    handleCurrentChange(val) {
      this.listQuery.page = val
      this.getFeedbackList()
    }
  },
  mounted() {

  }
}
</script>

<style scoped>
</style>
